<template>
  <div>
    <r-search
      ref="search"
      :searchData="searchData"
      :searchForm="searchForm"
      :searchHandle="searchHandle"
      :inline="true"
    />
    <div class="contentBattery">
      <div class="contentBattery1">Automatic Deposit Withdrawal Audit：</div>
      <el-switch
        v-model="depositCheckEnable"
        @change="SetdepositCheckEnableFn"
        class="contentBattery2"
      />
      <!-- <el-button round  type="success"  @click="SetdepositCheckEnableFn" :disabled="isDepositCheckEnable">Save</el-button> -->
    </div>

    <r-table
      :isPagination="true"
      :isHandle="true"
      :tableData="tableData"
      :tableCols="tableCols"
      :tablePage="pagination"
      :loading="tableLoading"
      :tableHandles="tableHandles"
      :isSelection="false"
      @refresh="page()"
    />

    <r-form
      :formRules="formRules"
      :formHandle="formHandle"
      :formData="formData"
      :formCols="formCols"
      ref="elForm"
      labelWidth="100px"
      dialogWidth="500px"
      :isHandle="true"
    />
  </div>
</template>

<script>
export default {
  components: {},
  data() {
    return {
      depositCheckEnable: false,
      isDepositCheckEnable: false,
      searchData: {
        applyName: "",
        applyPhone: "",
        status: "",
        beginTime: "",
        endTime: ""
      },
      searchForm: [
        {
          type: "input",
          placeholder: "Applicant Name",
          prop: "applyName",
          width: 240
        },
        {
          type: "input",
          placeholder: "Phone",
          prop: "applyPhone",
          width: 180
        },
        // {
        // 	type: 'daterange',
        // 	placeholder: 'Application Time',
        // 	prop: 'date',
        // 	width: 300,
        // 	change: e => {
        // 		if (e) {
        // 			console.log(e);
        // 			this.searchData.beginTime = e[0]
        // 			this.searchData.endTime = e[1]
        // 		} else {
        // 			this.searchData.beginTime = ''
        // 			this.searchData.endTime = ''
        // 		}
        // 	}
        // },
        {
          type: "date",
          placeholder: "Start Date",
          prop: "beginTime",
          width: 220,
          change: val => {
            this.searchData.beginTime = val;
          }
        },
        {
          type: "date",
          placeholder: "End Date",
          prop: "endTime",
          width: 220,
          change: val => {
            this.searchData.endTime = val;
          }
        },
        {
          type: "select",
          placeholder: "Audit Result",
          prop: "status",
          width: 250,
          options: [
            { label: "Pending Review", value: "1" },
            { label: "Already Passed", value: "2" },
            { label: "No Pass", value: "3" }
          ]
        }
      ],
      searchHandle: [
        {
          type: "primary",
          label: "Search",
          plain: true,
          handle: e => {
            this.zeroFn();
            this.getData();
          }
        },
        {
          label: "Reset",
          buttonss: true,
          icon: "el-icon-refresh-right",
          handle: e => {
            this.searchData = {
              applyName: "",
              applyPhone: "",
              status: "",
              beginTime: "",
              endTime: ""
            };
            this.zeroFn();
            this.getData();
          }
        }
      ],
      tableLoading: false,
      tableData: [{}],
      tableCols: [
        // { label: 'ID', prop: 'id' },
        { label: "Order Nnumber", prop: "orderNo" },
        // { label: '订单Type', prop: 'type' },
        // 1 Pending Review 2已通过 3不通过
        {
          label: "Order Status",
          prop: "status",
          itemClass: e =>
            e.status == 2 ? "success" : e.status == 3 ? "danger" : "",
          formatter: e =>
            e.status == 1
              ? "Pending Review"
              : e.status == 2
              ? "Already Passed"
              : e.status == 3
              ? "No Pass"
              : "--"
        },
        // { label: "是否已Return设备", prop: "consumptionMoney",  },
        { label: "User Message", prop: "applyName" },
        { label: "User Phone", prop: "applyPhone" },
        // { label: "提现信息", prop: "isVip_des",  },
        { label: "Order beforehand Payment Deposit", prop: "money" },
        // { label: "ResidueDeposit", prop: "isVip_des",  },
        { label: "Application Time", prop: "ctime" },
        // { label: "审核结果", prop: "isVip_des",  },
        { label: "Audit feedback", prop: "rejectReason" },
        { label: "Audit Time", prop: "checkTime" },
        {
          label: "Operations",
          type: "button",
          width: 200,
          btnList: [
            {
              label: "Passed",
              type: "text",
              isShow: e => e.status == 1,
              handle: row => {
                this.$confirm("Are you sure about your application?", "Hint", {
                  confirmButtonText: "Confirm",
                  cancelButtonText: "Cancel",
                  type: "warning"
                })
                  .then(async () => {
                    const res = await this.apis.depositReturn_check({
                      id: row.id,
                      status: 2
                    });

                    this.$message({
                      message: "Operations Success！",
                      type: "success"
                    });
                    this.getData();
                  })
                  .catch(() => {});
              }
            },
            {
              label: "No Pass",
              type: "text",
              isShow: e => e.status == 1,
              handle: row => {
                this.formData.id = row.id;
                this.elFormVisible("Reject");
              }
            }
          ]
        }
      ],
      tableHandles: [
        // {
        //   label: "Export",
        //   type: "primary",
        //   handle: e => this.elFormVisible()
        // },
      ],
      pagination: { limit: 10, offset: 1, total: 0 },

      checkBox: [],

      formData: {
        id: "",
        status: 3,
        rejectReason: ""
      },
      formCols: [
        {
          type: "input",
          label: "Reject Reason",
          width: 350,
          prop: "rejectReason",
          rmblock: true,
          remark: ""
        }
      ],
      formRules: {
        rejectReason: [
          { required: true, message: "Please Enter", trigger: "blur" }
        ]
      },
      formHandle: [
        {
          label: "Cancel",
          handle: e => this.elFormVisible()
        },
        {
          label: "Confirm",
          type: "success",
          handle: e => this.elFormSubmit()
        }
      ]
    };
  },
  created() {},
  mounted() {
    this.getData();
    this.GetdepositCheckEnableFn();
  },
  methods: {
    zeroFn() {
      this.pagination.limit = 10;
      this.pagination.offset = 1;
      this.pagination.total = 0;
    },
    async getData() {
      var res = await this.apis.depositReturn_list({
        applyPhone: this.searchData.applyPhone,
        applyName: this.searchData.applyName,
        status: this.searchData.status,
        beginTime: this.searchData.beginTime,
        endTime: this.searchData.endTime,
        pageNum: this.pagination.offset,
        pageSize: this.pagination.limit
      });
      var list = res.rows || [];

      this.tableData = list;
      this.pagination.total = res.total;
    },
    // 修改运营Setup--Deposit是否审核
    async SetdepositCheckEnableFn() {
      // this.isDepositCheckEnable = true
      this.depositCheckEnable = this.depositCheckEnable ? 1 : 2;
      let res = await this.apis.operatorSettingEdit({
        depositCheckEnable: this.depositCheckEnable
      });
      this.$message({
        type: res.code == 200 ? "success" : "error",
        message: res.msg
      });
      // setTimeout(() => {
      // 	this.isDepositCheckEnable = false
      // }, 2000)
      this.GetdepositCheckEnableFn();
    },
    // 获取运营Setup--Deposit是否审核
    async GetdepositCheckEnableFn() {
      let res = await this.apis.operatorSettingGet();
      this.depositCheckEnable =
        res.data.depositCheckEnable === 1 ? true : false;
      console.log(333, this.depositCheckEnable);
    },

    async elFormSubmit(row) {
      this.$refs.elForm.$refs.ruleForm.validate(async valid => {
        if (valid) {
          const res = await this.apis.depositReturn_check(this.formData);

          this.$message({
            message: "Operations Success！",
            type: "success"
          });
          this.getData();
          this.elFormVisible();
        }
      });
    },
    page() {
      this.getData();
    }
  }
};
</script>

<style scoped lang="scss">
.contentBattery {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 15px;
  width: 380px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contentBattery1 {
  margin-top: 1px;
  margin-right: 10px;
}

.contentBattery2 {
  margin-right: 30px;
}
</style>
